@import './base/variables.less';
.container-scroll-wrapper {
	.mr10 {
		margin-right: 10px;
	}
	.mt5 {
		margin-top: 5px;
	}
	.table {
		min-width: 100%;
		margin-bottom: 0px;
	}
	.table-wrapper {
		// flex: 1;
		/*position: absolute;
    top: 63px;
    left: 0px;
    right: 0px;
    bottom: @tableFootH;*/
		position: relative;
		// margin-top: @spacing;
		padding: 0 @spacing * 2;
		// display: flex;
		// flex-direction: column;
		// min-height: 400px;
		// overflow: hidden;
		.table-box {
			flex: 1;
			height: 100%;
			border: none;
			overflow: auto;
			table {
				tr th {
					background-color: @greyF8;
				}
				tr th,
				tr td {
					vertical-align: middle;
					font-size: 14px;
					.icheck-icon {
						vertical-align: middle;
						padding: 0;
						margin: 0;
					}
					&.center {
						text-align: center;
						width: 52px;
					}
				}
			}
		}
		.el-table__empty-block {
			width: 100% !important;
		}
	}
	.functional-btn-box {
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		margin-bottom: 4px;
		.operate-btn-group {
			margin-right: 8px;
			// flex: 1;
			// + .operate-btn-group {
			//   margin-left: 8px;
			// }
			.ake_btn {
				margin-bottom: 8px;
				+ .ake_btn {
					margin-left: 20px;
				}
			}
		}
		.standard-btn-group {
			flex: 1;
		}
		.tree-btn-group {
			margin-right: 16px;
			.btn-icon-left {
				background: url(../../assets/img/ake-icon.png) no-repeat -312px center;
			}
			.ake_btn_show_tree {
				position: relative;
				display: flex;
				// justify-content: center;
				align-items: center;
				width: 260px;
				padding-left: 4px;
				padding-right: 4px;
				span {
					flex: 1;
					display: inline-block;
					margin-left: 4px;
					margin-right: 8px;
					text-align: left;
				}
				.btn-icon {
					display: inline-block;
					width: 24px;
					height: 24px;
					line-height: 24px;
				}
			}
		}
		.table-btn-group {
			position: relative;
			font-size: 0;
			// margin-bottom: 8px;
			.ake_btn.ake_font_btn {
				font-size: 18px;
			}
			.setting-btn {
				display: inline-block;
				width: 34px;
				height: 34px;
				background: url('../img/ic_form_custom.svg') no-repeat center center;
				background-size: cover;
			}
			.table-setting-box {
				position: absolute;
				top: 40px;
				right: -11px;
				width: 280px;
				max-height: 340px;
				background-color: rgba(51, 51, 51, 0.9);
				color: #fff;
				font-size: 13px;
				border-radius: 6px;
				transform-origin: 89% -10px;
				z-index: 2200;
				.setting-scroll-box {
					width: 100%;
					max-height: 340px;
					overflow-y: scroll;
				}
				&::after {
					content: '';
					position: absolute;
					top: -10px;
					right: 22px;
					width: 0;
					height: 0;
					border: 10px solid transparent;
					border-width: 0 6px 10px;
					border-bottom-color: rgba(51, 51, 51, 0.9);
				}
				ul {
					width: 100%;
					padding: 0px 10px 0px 15px;
					-webkit-user-select: none;
					user-select: none;
					li {
						height: auto;
						line-height: 24px;
						margin-top: 12px;
						&:not(.has-second-stage) {
							height: 24px;
						}
						.second-header {
							padding-bottom: 0px;
							li {
								height: 24px;
								padding-bottom: 0px;
							}
						}
						label {
							font-weight: 700;
							cursor: pointer;
							vertical-align: bottom;
						}
						.icheck-icon {
							/*vertical-align: bottom;*/
						}
						&.not-all {
							&:last-child {
								border-bottom: 1px dashed #fff;
							}
						}
						&:last-child {
							height: 24px + @spacing * 2;
							padding-bottom: @spacing;
						}
						&.has-second-stage {
							&:last-child {
								height: auto;
								padding-bottom: @spacing * 2;
							}
						}
					}
					+ ul {
						li {
							&:last-child {
								border-bottom: 0;
								margin-bottom: 15px;
								padding-bottom: 0px;
								height: 24px;
							}
							&.has-second-stage {
								&:last-child {
									margin-bottom: 0px;
									li {
										margin-bottom: 0px;
									}
								}
							}
						}
					}
				}
			}
		}
	}

	.operate-btn-box {
		display: inline-block;
		margin-left: @spacing;
		line-height: 0;
		vertical-align: baseline;
		i {
			display: inline-block;
			width: 15px;
			height: 15px;
			line-height: 12px;
			text-align: center;
			font-size: 10px;
			border: 2px solid;
			border-radius: 50%;
			margin-right: @spacing / 2;
			cursor: pointer;
		}
		.form-control {
			display: inline-block;
			width: 54px;
			height: 24px;
			line-height: 24px;
			text-align: center;
			padding-left: @spacing / 2;
			padding-right: 0px;
		}
		.light-green {
			color: @green;
			border-color: @green;
			&:hover {
				color: darken(@green, 5%);
				border-color: darken(@green, 5%);
			}
		}
	}

	.table-wrapper table {
		border-left: 0;
		thead {
			th {
				// background-color: @whiteGrey;
			}
		}
		thead tr th,
		tbody tr td {
			height: 32px;
			max-height: 32px;
			line-height: 32px;
			// background-color: @whiteGrey;
			padding: 0px 8px;
			white-space: nowrap;

			&.operateCell {
				padding-right: 4px;
				padding-bottom: 4px;
			}

			&.selection-td {
				padding-left: 0;
				padding-right: 0;
			}

			&:first-child {
				border-left: 0;
			}
			img {
				cursor: pointer;
			}
		}
		tbody tr {
			&:hover,
			&.active {
				td {
					// background-color: @cream;
				}
			}
		}
		tbody {
			tr:nth-of-type(odd) {
				td {
					// background-color: #FFF;
				}
				&:hover,
				&.active {
					td {
						// background-color: @cream;
					}
				}
			}
		}
	}

	.el-table .cell,
	.el-table th > div {
		padding: 0;
	}
	.el-table__fixed-header-wrapper thead div,
	.el-table__header-wrapper thead div {
		background: none;
	}
	.el-table__empty-text {
		font-size: 24px;
	}
	.el-button--small.ake_font_btn {
		font-size: 12px;
	}
	.table-wrapper .el-table--striped .el-table__body tr.hover-row td {
		background-color: @cream;
	}
	table {
		// .el-button.el-button--primary {
		//   height: 24px;
		//   line-height: 24px;
		//   padding-top: 0px;
		//   padding-bottom: 0px;
		// }
		.el-button,
		.ake_btn {
			margin-right: 3px;
			margin-top: 3px;
			vertical-align: middle;
		}
		.ake_btn + .ake_btn {
			margin-left: 0px;
		}
		.el-button + .el-button {
			margin-left: 0px;
		}
	}
	.el-table__fixed,
	.el-table__fixed-right {
		box-shadow: none;
	}
	.el-table__fixed-right {
		table {
			thead th,
			tbody td {
				border-left: 1px solid #ddd;
			}
		}
	}
	.el-table {
		td,
		th {
			.cell {
				text-overflow: unset;
				word-break: break-all;
				font-size: 10px;
			}
		}
	}

	.cell {
		.ake-icon-font {
			width: 26px;
			height: 24px;
			line-height: 24px;
			text-align: center;
			padding: 0 !important;

			i {
				&[class*='el-icon-'],
				&[class*='icon-'] {
					line-height: 20px;
				}
				&[class*='icon-']:not([class*='el-icon-']) {
					font-size: 22px;
				}
			}
		}
	}
	.cell {
		.el-button--primary.is-plain,
		.el-button--danger.is-plain {
			&.is-disabled {
				color: @greyB8;
				border-color: @greyB8;
				background: @greyF7;

				&:hover,
				&:focus,
				&:active {
					color: @greyB8;
					border-color: @greyB8;
					background: @greyF7;
				}
			}
		}
	}

	.el-button--danger.is-plain {
		background: #fff;
	}
}
